<script setup>
import { ref } from 'vue'

const taskLog = ref([])


window.taskLogAPI.onTask((value) => {
  // 如果存在则不添加
  if(taskLog.value.includes(JSON.parse(value).info)) return
  taskLog.value.push(JSON.parse(value).info)
})

</script>

<template>
  <div class="info-bottom no-drag">
    任务历史:
    <n-scrollbar style="max-height: 200px">
      <template v-for="task in taskLog" :key="task" style="text-align: center;height: 20px">
        <div style="display: flex;flex-direction: row;">
          <div class="green" style="margin: 8px 0 0 5px;"></div>
          <div style="height: 25px;font-size: 13px;margin-left: 15px;">{{ task }}</div>
        </div>
      </template>
    </n-scrollbar>

  </div>
</template>

<style scoped>
.info-bottom{
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.34);
  border-radius: 15px;
  height: 250px;
  padding: 5px;
}
</style>